<template>
	<view>
		<navbar></navbar>
		<view class="container">
			<view class="Top_tilte">
				实名认证
			</view>
			<view class="upPhoto">
				<view class="text">
					上传身份证照片
				</view>
				<view class="Photo">
						<upimage v-if="!message" @result='imgResult' :currenttype="currenttype"></upimage>
						<image v-else :src="message" mode=""></image>
						<view v-if="message" class="icon" @click="Delete(1)">
							<image src="../../../static/images/user/img_cancel.png" mode=""></image>
						</view>
				</view>
				<view class="Photo">
					<upimage v-if="!message1" @result='imgResult1' :currenttype="currenttype1"></upimage>
					<image v-else :src="message1" mode=""></image>
					<view v-if="message1" class="icon" @click="Delete(2)" >
						<image src="../../../static/images/user/img_cancel.png" mode=""></image>
					</view>
				</view>
				<view class="choice">
					<view class="icon"  @click="isChoice = !isChoice">
						<image v-if="!isChoice" src="@/static/images/user/choice.png" mode=""></image>
						<image v-else src="@/static/images/user/choice1.png" mode=""></image>
					</view>
					<view class="text">
						已阅读并同意<text class="dark" @click="showRegisterAgreement('privacy_agreement', privacy_agreement_title)">《用户隐私协议》</text>
					</view>
				</view>
			</view>
			<view class="Submit" v-if="!isBTN" >
				认证信息
			</view>
			<view class="Submit" v-else style="background-color: #3A81F6;" @tap.stop.prevent='userOpenAcctVerify'>
				认证信息
			</view>
			<uni-popup style="background-color: #fff;" ref="popup" :is-mask-click='false' type='center' width="40%" :show-title="false" :show-confirm-button="false">
			    <view class='sk-wave'>
			        <view class='sk-rect sk-rect-1'></view>
			        <view class='sk-rect sk-rect-2'></view>
			        <view class='sk-rect sk-rect-3'></view>
			        <view class='sk-rect sk-rect-4'></view>
			        <view class='sk-rect sk-rect-5'></view>
			    </view>
			    <view class="text_msg"
			          style="padding: 10rpx 20rpx 40rpx 20rpx;text-align: center;font-size:26rpx;line-height:40rpx;">
			        图片上传中...
			    </view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import {
		isPhone
	} from "@/utils/verify.js"
	import upimage from '@/components/upload/upImage.vue'
	export default {
		data() {
			return {
				isChoice: false, //勾选协议
				popupshow: true, //
				popupshow1: true,
				count: 0, //第一次倒计时
				count1: 0, //第二次倒计时
				timer: false, //倒计时开关
				timer1: false, //倒计时开关
				password: '', //加密密码
				message: null, //正面照
				message1: null, //国徽
				token: '',
				id_portrait: '', //人面照id
				id_emblem: '', //国徽面id
				txn_seqno: '', //第二次验证码返回
				LLtoken: '', //第二次验证码返回的连连token
				isBTN:false,//按钮
				isLoadding:false,
				currenttype: '1',
				currenttype1: '2',
				privacy_agreement_title: '隐私政策',
				id_exp:'99991231',//身份证有效期
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			this.token = uni.getStorageSync('token')
			
		},
		onShow(){
			
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
		},
		mounted() {
			let res = uni.getStorageSync('userInfo')
			this.InputList[0].value = res.phone

		},
		methods: {
			Delete(e){
				if(e == 1){
					this.message = ''
				}else{
					this.message1 = ''
				}
			},
			showRegisterAgreement(type, title) {
				console.log(1)
			    uni.navigateTo({
			     url:`../../login/agreement?type=${type}&title=${title}`
			    })
			   },
			//img上传
			imgResult(e) {
				console.log(e)
				// this.message = e
				// this.currenttype.url = e
				this.llUpload(e, 1)
			},
			//img上传
			imgResult1(e) {
				console.log(e)
				// this.message = e
				// this.currenttype.url = e
				this.llUpload(e, 2)
			},
			//点击认证
			determine() {
					this.isBTN = true
			},
			
			//连连上传文件
			llUpload(e, i) {
				let _this = this
				this.$refs.popup.open()
				app._post_form('Upload/llUpload', {
					token: _this.token,
					file_context: e
				}, function(result) {
					if (1 == result.code) {
						if (result.data.code == 1) {
							_this.$refs.popup.close()
							if (i == 1) {
								_this.message = e
								_this.id_portrait = result.data.data.doc_id
							} else {
								_this.message1 = e
								_this.id_emblem = result.data.data.doc_id
							}
						} else {
							_this.$refs.popup.close()
							app.showError('照片上传失败');
						}
					}
				}, null, function() {
					_this.$refs.popup.close()
				});
			},
			
			//提交开户实名
			userOpenAcctVerify() {
				this.$refs.popup.open()
				let _this = this
				app._post_form('user/updateUserInfo', {
					token: _this.token,
					id_emblem: _this.id_emblem,
					id_portrait: _this.id_portrait,
					id_exp:'99991231'
				}, function(result) {
					if (1 == result.code) {
						app.showToast('实名成功');
						setTimeout(() => {
							uni.redirectTo({
								url: `../index`
							});
						}, 1500)

					}
				}, null, function() {
					_this.$refs.popup.close()
					app.showError(result.msg);
				});

			},
		},
		watch:{
			isChoice(val, oldVal){
				if(val){
					this.determine()
				}else{
					this.isBTN = false
				}
			}
		},
		components: {
		    upimage,
		},
	}
</script>

<style lang="scss" scoped>
	.container {
		background-color: #EEF2F7;
		// height: 100vh;
		padding-bottom: 50rpx;
	}

	.Bottom_boder {
		border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
	}

	.Top_tilte {
		margin-top: 40rpx;
		width: 100%;
		height: 80rpx;
		background-color: #FFFFFF;
		text-align: center;
		color: rgba(0, 0, 0, 0.9);
		font-size: 30rpx;
		font-family: 'dy-iconfont';
		font-weight: bold;
		line-height: 80rpx;
	}

	.BGC {
		background-color: #FAFAFA;
		padding-top: 50rpx;
		padding-bottom: 50rpx;

		.List_entrance {
			margin: 0 30rpx;

			border-radius: 20rpx;
			background-color: #FFFFFF;
			box-shadow: 0rpx 4rpx 6rpx 1rpx rgba(0, 0, 0, 0.02);
			padding: 0 30rpx;

			.List_item {
				height: 100rpx;
				background-color: #FFF;
				display: flex;
				align-items: center;
				// justify-content: space-between;
				font-size: 28rpx;
				font-weight: 400;
				color: rgba(0, 0, 0, 0.9);
				input{
					font-size: 28rpx;
				}
				.input {
					input{
						width: 400rpx;
						
					}
					
				}

				.inputYzm {
					width: 430rpx;
					height: 48rpx;
					display: flex;
					align-items: center;

					// justify-content: space-between;
					input {
						width: 280rpx;
					}

					.yzm {
						font-size: 24rpx
					}
				}
			}
		}
	}

	.upPhoto {
		padding: 40rpx;

		.text {
			font-size: 26rpx;
			font-weight: 500;
			color: #000000;
			.dark{
				margin-left: 10rpx;
				color: #000;
				font-size: 28rpx;
			}
		}

		.Photo {
			margin: 30rpx auto;
			padding: 30rpx 0;
			// margin-top: 30rpx;
			width: 546rpx;
			height: 344rpx;
			border-radius: 20rpx;
			position: relative;
			image {
				width: 100%;
				height: 100%;
				border-radius: 20rpx;
				object-fit: cover !important;
			}
			.icon{
				position: absolute;
				top: 40rpx;
				right: 10rpx;
				width: 50rpx;
				height: 50rpx;
				image{
					width: 100%;
					height: 100%;
				}
			}

			Input {}
		}

		.choice {
			margin-top: 30rpx;
			display: flex;

			.icon {
				width: 32rpx;
				height: 32rpx;
				margin-right: 20rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.text {
				line-height: 40rpx;
				font-size: 24rpx;
				font-weight: 500;
				color: rgba(0, 0, 0, 0.6);
			}
		}
	}

	.Submit {
		width: 92%;
		margin: 40rpx 30rpx;
		height: 88rpx;
		line-height: 88rpx;
		text-align: center;
		background-color: #BBD3FB;
		color: #FFF;
		border-radius: 10rpx;
	}
	/deep/ .uni-popup__wrapper{
		width: 300rpx;
		background-color: #FAFAFA !important;
	}
</style>
